<template>
    <el-dialog v-model="dialogFormVisible" :title="type ? '流程提交' : '流程审批'" draggable width="30%">
        <el-form :model="form" label-width="auto" :rules="rules" ref="ruleFormRef" v-loading="isLoading"
            element-loading-text="数据加载中...">
            <el-form-item label="下级审批人" prop="assigneeId"
                v-if="form.currentNodeType === '0' || (form.currentNodeType !== '4' && form.approvalStatus === '1')">
                <el-select clearable v-model="form.assigneeId" filterable placeholder="请选择下级审批人" style="width: 200px">
                    <el-option v-for="item in assignees" :key="item.userId" :label="item.username"
                        :value="item.userId" />
                </el-select>
            </el-form-item>
            <el-form-item label="审批状态" v-if="!type">
                <el-tag type="success" v-if="form.approvalStatus === '1'">同意</el-tag>
                <el-tag type="danger" v-if="form.approvalStatus === '2'">拒绝</el-tag>
                <el-tag type="warning" v-if="form.approvalStatus === '3'">退回</el-tag>
            </el-form-item>
            <el-form-item label="审批意见" prop="remark" style="width: 80%;" v-if="!type">
                <el-input type="textarea" v-model="form.remark" placeholder="请输入审批意见" />
            </el-form-item>
        </el-form>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="dialogFormVisible = false">返回</el-button>
                <el-button type="primary" :disabled="isLoading" @click="submit">确认</el-button>
            </div>
        </template>
    </el-dialog>
</template>
<script setup>
import { ref } from "vue";
import { ElMessage } from 'element-plus'
import api from "@/api"

const isLoading = ref(false)
const dialogFormVisible = ref(false)
const assignees = ref([])
const form = ref({})
const type = ref(true)//true-start，false-commit
const ruleFormRef = ref()
const rules = ref({
    assigneeId: [
        { required: true, message: '请选择下级审批人', trigger: 'blur' }
    ]
})

//初始组件satrt
const initStart = async (definitionId, instanceId, data) => {
    isLoading.value = true
    dialogFormVisible.value = true
    type.value = true
    form.value = {}
    form.value.data = data
    form.value.instanceId = instanceId
    const res = await api.post('/workflow/init', { definitionId, data })
    if (res.data.code === 200) {
        const data = res.data.data
        assignees.value = data.assignees
        form.value.definitionId = data.definitionId
        form.value.nextNodeId = data.nextNodeId
        form.value.currentNodeType = data.currentNodeType
    } else {
        ElMessage.error(res.data.msg)
    }
    isLoading.value = false

}

//初始组件commit
const initCommit = async (taskId, instanceId, approvalStatus, data) => {
    isLoading.value = true
    dialogFormVisible.value = true
    type.value = false
    form.value = {}
    form.value.approvalStatus = approvalStatus
    form.value.taskId = taskId
    form.value.data = data
    const res = await api.post('/workflow/init', { instanceId })
    if (res.data.code === 200) {
        const data = res.data.data
        assignees.value = data.assignees
        form.value.nextNodeId = data.nextNodeId
        form.value.instanceId = data.instanceId
        form.value.currentNodeType = data.currentNodeType
    } else {
        ElMessage.error(res.data.msg)
    }
    isLoading.value = false
}

const emit = defineEmits(['serversUpdated']);
const submit = () => {
    ruleFormRef.value.validate(async (valid) => {
        if (valid) {
            isLoading.value = true
            let url
            if (type.value) {
                url = '/workflow/start'
            } else {
                url = '/workflow/commit'
            }
            const res = await api.post(url, form.value)
            if (res.data.code === 200) {
                ElMessage.success(res.data.msg)
                emit('serversUpdated')
                dialogFormVisible.value = false
            } else {
                ElMessage.error(res.data.msg)
            }
            isLoading.value = false
        }
    })
}
defineExpose({
    initStart,
    initCommit
});
</script>
<style lang="less"></style>